<!--
 * @Author: linzaifei 1609781601@qq.com
 * @Date: 2025-07-22 15:41:59
 * @LastEditors: linzaifei 1609781601@qq.com
 * @LastEditTime: 2025-08-15 14:23:27
 * @FilePath: /amap-web-vr/src/views/home/control/vc-vr-collect-control/index.vue
 * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
-->
<template>
    <div class="vc-vr-collect-control" :style="positionStyle" >
      <div class="vc-button" @click="onClickItem" >
            <img src="@/assets/images/home/ic_home_vr.png" class="image" />
            <span>我的收藏</span>
      </div>
    </div>
    <control-drawer ref="drawerRef" title="我的收藏" class="control-drawer">
       <vc-vr-collect-list />
    </control-drawer>
  </template>
  
<script setup lang="ts">
import { ref } from 'vue'
import { positionProps, usePosition } from '../composables/usePosition'

import VcVrCollectList from "./vc-vr-collect-list.vue";
import ControlDrawer from "../control-drawer.vue";
// import { useCustomCesium } from "../useCustomCesium";
// const {vueCesium} = useCustomCesium();
const drawerRef = ref()

const props = defineProps({
    ...positionProps,
})
const { positionStyle } = usePosition(props)

const onClickItem = ()=>{
  drawerRef.value.open()
}

</script>
  
<style scoped lang="scss">
  .vc-vr-collect-control {
    position: absolute;
    z-index: 100;
    .vc-button {
      width: 50px;
    }
    .active {
      background: var(--el-color-primary);
      color: #fff;
    }

    
  }
</style>